<template>
    <div class="content-type">   
      <el-menu
        :default-active="activeIndex"
        router
        class="el-menu-demo"
        mode="horizontal"
        @select="handleSelect"
        background-color="#FFFFFF"
        text-color="lightblue"
        active-text-color="#ffd04b"
        style="margin-bottom:0px"
      >
       <el-menu-item index="squre">广场</el-menu-item>
        <el-menu-item index="hit">热点</el-menu-item>
        <el-menu-item index="talk">讨论</el-menu-item>
      </el-menu>
    </div>
</template>

<script>
export default {
  name: "MidContent",
  data() {
    return {
      activeIndex: "squre",
    }

  },
  created() {
  },
  methods: {
     handleSelect(key, keyPath) {

    },
  }
};
</script>

<style  scoped>

.content-type {
  background-color: white;
  flex: 1;
  text-align: center;
  position: absolute;
  color: lightskyblue;
  bottom: 0px;
}

.el-menu-item {
  font-size: 18px;
}

</style>